<template>
  <div>
    <div>
      <input type="text"  @blur="show">
      <div :class="isShow? 'error':'error-show'">此项为必填</div>
    </div>
    <div>
      <input type="text" @blur="show">
      <div class="error" :style="{ visibility: isShow ? 'visible' : 'hidden' }">c</div>
    </div>
    <button @click="toast()">Toast</button>
  </div>
</template>

<script>
  import Toast from 'src/components/Toast/index.js'
  export default {
    mounted () {
    },
    data () {
      return {
        isShow: false
      }
    },
    methods: {
      show () {
        this.isShow = !this.isShow
      },
      toast () {
        Toast()
      }
    }
  }
</script>

<style>
  .error{
    color: red;
    visibility: hidden;
  }
  .error-show{
    color: red;
    visibility: visible;
  }
</style>